
<!doctype html>
<html ng-app="pagingApp">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="${basePath}/plugins/bootstrap-3.3.5/bootstrap.css">
    <style>
        .page-list .pagination {float:left;}
        .page-list .pagination span {cursor: pointer;}
        .page-list .pagination .separate span{cursor: default; border-top:none;border-bottom:none;}
        .page-list .pagination .separate span:hover {background: none;}
        .page-list .page-total {float:left; margin: 25px 20px;}
        .page-list .page-total input, .page-list .page-total select{height: 26px; border: 1px solid #ddd;}
        .page-list .page-total input {width: 40px; padding-left:3px;}
        .page-list .page-total select {width: 50px;}
    </style>
</head>
<body ng-controller="testController">
<tm-pagination conf="paginationConf"></tm-pagination>
<script src="${basePath}/plugins/angular-1.4.7/angular.js"></script>
<script src="${basePath}/js/paging/tm.pagination.js"></script>
<script>
    angular.module('pagingApp', ['tm.pagination']).controller('testController', function($scope){
        $scope.paginationConf = {
            currentPage: 1,
            totalItems: 200,
            itemsPerPage: 15,
            pagesLength: 15,
            perPageOptions: [10, 20, 30, 40, 50],
            rememberPerPage: 'perPageItems',
            onChange: function(){

            }
        };
    })
</script>
</body>
</html>